<!DOCTYPE html>
<html lang="zh-CN">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>导出功能快速修复工具</title>
    <link href="https://cdn.jsdelivr.net/npm/bootstrap@5.1.3/dist/css/bootstrap.min.css" rel="stylesheet">
    <link href="https://cdn.jsdelivr.net/npm/bootstrap-icons@1.7.2/font/bootstrap-icons.css" rel="stylesheet">
    <style>
        .diagnostic-card {
            transition: all 0.3s ease;
        }
        .diagnostic-card:hover {
            box-shadow: 0 4px 8px rgba(0,0,0,0.1);
        }
        .status-good { border-left: 4px solid #28a745; }
        .status-warning { border-left: 4px solid #ffc107; }
        .status-error { border-left: 4px solid #dc3545; }
        .code-output {
            background: #f8f9fa;
            border: 1px solid #dee2e6;
            border-radius: 4px;
            padding: 10px;
            font-family: 'Courier New', monospace;
            font-size: 12px;
            max-height: 200px;
            overflow-y: auto;
        }
    </style>
</head>
<body>
    <div class="container mt-4">
        <div class="row">
            <div class="col-md-8 mx-auto">
                <h1 class="text-center mb-4">
                    <i class="bi bi-tools text-primary"></i>
                    导出功能快速修复工具
                </h1>
                
                <div class="alert alert-info">
                    <h6><i class="bi bi-info-circle"></i> 使用说明</h6>
                    <p>如果线索管理页面的导出功能有问题，请按以下步骤操作：</p>
                    <ol>
                        <li>确保线索管理页面在另一个标签页中打开</li>
                        <li>点击下面的"运行诊断"按钮</li>
                        <li>根据诊断结果点击相应的修复按钮</li>
                        <li>返回线索管理页面重新尝试导出</li>
                    </ol>
                </div>
                
                <div class="card diagnostic-card mb-3">
                    <div class="card-header bg-primary text-white">
                        <h5 class="mb-0">
                            <i class="bi bi-search"></i> 1. 运行诊断
                        </h5>
                    </div>
                    <div class="card-body">
                        <p>检查导出功能的当前状态</p>
                        <button class="btn btn-primary" onclick="runDiagnostic()">
                            <i class="bi bi-play-circle"></i> 运行诊断
                        </button>
                        <div id="diagnosticResult" class="mt-3"></div>
                    </div>
                </div>
                
                <div class="card diagnostic-card mb-3">
                    <div class="card-header bg-warning text-dark">
                        <h5 class="mb-0">
                            <i class="bi bi-wrench"></i> 2. 快速修复
                        </h5>
                    </div>
                    <div class="card-body">
                        <p>如果诊断发现问题，使用以下修复功能：</p>
                        <div class="btn-group-vertical w-100">
                            <button class="btn btn-warning mb-2" onclick="forceFixSelection()">
                                <i class="bi bi-arrow-clockwise"></i> 重置选中状态
                            </button>
                            <button class="btn btn-info mb-2" onclick="rebindEvents()">
                                <i class="bi bi-link"></i> 重新绑定事件
                            </button>
                            <button class="btn btn-success" onclick="fullReset()">
                                <i class="bi bi-bootstrap-reboot"></i> 完全重置导出功能
                            </button>
                        </div>
                        <div id="fixResult" class="mt-3"></div>
                    </div>
                </div>
                
                <div class="card diagnostic-card mb-3">
                    <div class="card-header bg-success text-white">
                        <h5 class="mb-0">
                            <i class="bi bi-check-circle"></i> 3. 验证修复
                        </h5>
                    </div>
                    <div class="card-body">
                        <p>修复后验证功能是否正常</p>
                        <button class="btn btn-success" onclick="testExportFunction()">
                            <i class="bi bi-check2-circle"></i> 测试导出功能
                        </button>
                        <div id="testResult" class="mt-3"></div>
                    </div>
                </div>
                
                <div class="card diagnostic-card">
                    <div class="card-header bg-dark text-white">
                        <h5 class="mb-0">
                            <i class="bi bi-terminal"></i> 调试信息
                        </h5>
                    </div>
                    <div class="card-body">
                        <p>详细的技术信息和日志</p>
                        <button class="btn btn-outline-dark" onclick="showDebugInfo()">
                            <i class="bi bi-code-square"></i> 显示调试信息
                        </button>
                        <div id="debugInfo" class="mt-3"></div>
                    </div>
                </div>
            </div>
        </div>
    </div>
    
    <script src="https://cdn.jsdelivr.net/npm/bootstrap@5.1.3/dist/js/bootstrap.bundle.min.js"></script>
    <script>
        function runDiagnostic() {
            const result = document.getElementById('diagnosticResult');
            result.innerHTML = '<div class="spinner-border spinner-border-sm me-2"></div>正在诊断...';
            
            setTimeout(() => {
                try {
                    // 尝试获取线索管理页面的窗口
                    const cluesWindow = findCluesWindow();
                    
                    if (!cluesWindow) {
                        result.innerHTML = `
                            <div class="alert alert-warning status-warning">
                                <h6><i class="bi bi-exclamation-triangle"></i> 无法连接线索管理页面</h6>
                                <p>请确保线索管理页面在另一个标签页中打开</p>
                                <button class="btn btn-sm btn-outline-primary" onclick="openCluesPage()">打开线索管理页面</button>
                            </div>
                        `;
                        return;
                    }
                    
                    // 执行诊断
                    const diagnostic = cluesWindow.debugExportJS ? cluesWindow.debugExportJS() : null;
                    
                    if (!diagnostic) {
                        result.innerHTML = `
                            <div class="alert alert-error status-error">
                                <h6><i class="bi bi-x-circle"></i> 导出功能未加载</h6>
                                <p>外部JS文件可能没有正确加载</p>
                            </div>
                        `;
                        return;
                    }
                    
                    // 分析诊断结果
                    let statusClass = 'status-good';
                    let statusIcon = 'bi-check-circle';
                    let statusText = '功能正常';
                    let issues = [];
                    
                    if (!diagnostic.exportBtn) {
                        issues.push('导出按钮未找到');
                        statusClass = 'status-error';
                    }
                    
                    if (diagnostic.totalCheckboxes === 0) {
                        issues.push('没有线索复选框');
                        statusClass = 'status-warning';
                    }
                    
                    if (!diagnostic.dataSync) {
                        issues.push('选中状态不同步');
                        statusClass = 'status-error';
                    }
                    
                    if (diagnostic.isExporting) {
                        issues.push('导出状态卡住');
                        statusClass = 'status-warning';
                    }
                    
                    if (issues.length > 0) {
                        statusIcon = statusClass === 'status-error' ? 'bi-x-circle' : 'bi-exclamation-triangle';
                        statusText = `发现 ${issues.length} 个问题`;
                    }
                    
                    result.innerHTML = `
                        <div class="alert alert-info ${statusClass}">
                            <h6><i class="${statusIcon}"></i> 诊断结果：${statusText}</h6>
                            ${issues.length > 0 ? `
                                <ul class="mb-2">
                                    ${issues.map(issue => `<li>${issue}</li>`).join('')}
                                </ul>
                            ` : '<p>所有功能正常工作</p>'}
                            <div class="code-output">
                                <strong>详细信息：</strong><br>
                                选中线索数量: ${diagnostic.selectedClues.length}<br>
                                复选框总数: ${diagnostic.totalCheckboxes}<br>
                                选中复选框数: ${diagnostic.checkedCheckboxes}<br>
                                数据同步: ${diagnostic.dataSync ? '是' : '否'}<br>
                                导出状态: ${diagnostic.isExporting ? '进行中' : '空闲'}
                            </div>
                        </div>
                    `;
                } catch (error) {
                    result.innerHTML = `
                        <div class="alert alert-danger status-error">
                            <h6><i class="bi bi-bug"></i> 诊断失败</h6>
                            <p>错误信息: ${error.message}</p>
                        </div>
                    `;
                }
            }, 500);
        }
        
        function forceFixSelection() {
            const result = document.getElementById('fixResult');
            const cluesWindow = findCluesWindow();
            
            if (!cluesWindow) {
                result.innerHTML = '<div class="alert alert-warning">请先打开线索管理页面</div>';
                return;
            }
            
            try {
                const fixResult = cluesWindow.forceFixSelection ? cluesWindow.forceFixSelection() : '功能不可用';
                result.innerHTML = `
                    <div class="alert alert-success">
                        <i class="bi bi-check-circle"></i> ${fixResult}
                    </div>
                `;
            } catch (error) {
                result.innerHTML = `
                    <div class="alert alert-danger">
                        <i class="bi bi-x-circle"></i> 修复失败: ${error.message}
                    </div>
                `;
            }
        }
        
        function rebindEvents() {
            const result = document.getElementById('fixResult');
            const cluesWindow = findCluesWindow();
            
            if (!cluesWindow) {
                result.innerHTML = '<div class="alert alert-warning">请先打开线索管理页面</div>';
                return;
            }
            
            try {
                if (cluesWindow.rebindExportEvents) {
                    cluesWindow.rebindExportEvents();
                    result.innerHTML = `
                        <div class="alert alert-success">
                            <i class="bi bi-check-circle"></i> 事件重新绑定完成
                        </div>
                    `;
                } else {
                    result.innerHTML = '<div class="alert alert-warning">rebindExportEvents 函数不可用</div>';
                }
            } catch (error) {
                result.innerHTML = `
                    <div class="alert alert-danger">
                        <i class="bi bi-x-circle"></i> 重新绑定失败: ${error.message}
                    </div>
                `;
            }
        }
        
        function fullReset() {
            const result = document.getElementById('fixResult');
            result.innerHTML = '<div class="spinner-border spinner-border-sm me-2"></div>正在重置...';
            
            setTimeout(() => {
                const cluesWindow = findCluesWindow();
                
                if (!cluesWindow) {
                    result.innerHTML = '<div class="alert alert-warning">请先打开线索管理页面</div>';
                    return;
                }
                
                try {
                    // 执行多个修复步骤
                    if (cluesWindow.forceFixSelection) cluesWindow.forceFixSelection();
                    if (cluesWindow.rebindExportEvents) cluesWindow.rebindExportEvents();
                    if (cluesWindow.resetExportState) cluesWindow.resetExportState();
                    
                    result.innerHTML = `
                        <div class="alert alert-success">
                            <i class="bi bi-bootstrap-reboot"></i> 完全重置完成，请返回线索管理页面重新尝试
                        </div>
                    `;
                } catch (error) {
                    result.innerHTML = `
                        <div class="alert alert-danger">
                            <i class="bi bi-x-circle"></i> 重置失败: ${error.message}
                        </div>
                    `;
                }
            }, 1000);
        }
        
        function testExportFunction() {
            const result = document.getElementById('testResult');
            const cluesWindow = findCluesWindow();
            
            if (!cluesWindow) {
                result.innerHTML = '<div class="alert alert-warning">请先打开线索管理页面</div>';
                return;
            }
            
            try {
                if (cluesWindow.testExport) {
                    cluesWindow.testExport();
                    result.innerHTML = `
                        <div class="alert alert-info">
                            <i class="bi bi-play-circle"></i> 测试已开始，请查看线索管理页面的结果
                        </div>
                    `;
                } else {
                    result.innerHTML = '<div class="alert alert-warning">testExport 函数不可用</div>';
                }
            } catch (error) {
                result.innerHTML = `
                    <div class="alert alert-danger">
                        <i class="bi bi-x-circle"></i> 测试失败: ${error.message}
                    </div>
                `;
            }
        }
        
        function showDebugInfo() {
            const result = document.getElementById('debugInfo');
            const cluesWindow = findCluesWindow();
            
            if (!cluesWindow) {
                result.innerHTML = '<div class="alert alert-warning">请先打开线索管理页面</div>';
                return;
            }
            
            try {
                const debug = cluesWindow.debugExportJS ? cluesWindow.debugExportJS() : {};
                result.innerHTML = `
                    <div class="code-output">
                        <strong>完整调试信息:</strong><br>
                        ${JSON.stringify(debug, null, 2)}
                    </div>
                `;
            } catch (error) {
                result.innerHTML = `
                    <div class="alert alert-danger">
                        <i class="bi bi-x-circle"></i> 获取调试信息失败: ${error.message}
                    </div>
                `;
            }
        }
        
        function findCluesWindow() {
            // 尝试通过window.name或其他方式找到线索管理页面
            // 这里使用一个简单的方法，检查其他窗口
            try {
                // 检查opener
                if (window.opener && window.opener.debugExportJS) {
                    return window.opener;
                }
                
                // 如果是从线索页面打开的，可以尝试访问parent
                if (window.parent && window.parent !== window && window.parent.debugExportJS) {
                    return window.parent;
                }
                
                return null;
            } catch (e) {
                return null;
            }
        }
        
        function openCluesPage() {
            window.open('/admin/clues.html', 'cluesWindow');
        }
        
        // 页面加载时自动运行一次诊断
        window.addEventListener('load', function() {
            setTimeout(runDiagnostic, 1000);
        });
    </script>
</body>
</html> 